import React, { Component } from 'react';
import { Form, Input, Select, Button } from 'antd';
import { getStaffStateList } from '@/services/staffManage';

import '../index.css';

export default class index extends Component {
  state = {
    stateList: [],
  };

  formRef = React.createRef();

  // 重置form
  onReset = () => {
    this.formRef.current.resetFields();
    this.props.Refresh();
  };

  //获得部门状态列表
  getStateList = async () => {
    const init = await getStaffStateList();
    this.setState({ stateList: init });
  };

  componentDidMount() {
    this.getStateList();
  }

  componentWillUnmount(){
    this.setState = () =>{
      return;
    }
  }

  searchStaff = () => {
    this.formRef.current.submit();
  };

  onFinish = (values) => {
    this.props.searchHandle(values);
  };

  render() {
    const { stateList } = this.state;
    return (
      <div id="divSearch">
        <span className="span">
          <Form className="Search" layout="inline" ref={this.formRef} onFinish={this.onFinish}>
            <Form.Item name="searchKey" label="员工姓名" className="item1">
              <Input type="text" />
            </Form.Item>
            <Form.Item label="状态" className="item2" name="id">
              <Select className="select" allowClear={true}>
                {stateList.map((item) => {
                  return (
                    <Select.Option key={item.id} value={item.id}>
                      {item.name}
                    </Select.Option>
                  );
                })}
              </Select>
            </Form.Item>
            <Form.Item className="item3">
              <Button id="btn1" onClick={this.onReset}>
                重置
              </Button>
              <Button id="btn2" type="primary" onClick={this.searchStaff}>
                查询
              </Button>
            </Form.Item>
          </Form>
        </span>
      </div>
    );
  }
}
